<template>
  <div class="content">
    我是个人 收货地址
    
  </div>
</template>

<script>


export default {
  name: "setting",//个人中心 
  data() {
    return {
      items: [], // 存储数据的数组
      loading: false, // 加载状态
    };
  },
  methods: {
    loadMore() {
      if (this.loading) return; // 防止重复加载
      this.loading = true;
      // 模拟加载数据
      setTimeout(() => {
        const newItems = Array.from({ length: 10 }, (_, i) => ({ id: this.items.length + i + 1, value: `Item ${this.items.length + i + 1}` }));
        this.items = [...this.items, ...newItems];
        this.loading = false;
      }, 1000);
    },
    handleScroll(event) {
      const target = event.target; // 确保是在正确的元素上触发事件，例如一个列表容器或div元素。
      if (target.scrollHeight - target.scrollTop <= target.clientHeight) { // 检查是否到达底部或接近底部
        this.loadMore();
      }
    }
  },
  mounted() {
    // this.$nextTick(() => { // 确保DOM已经渲染完毕，然后添加监听器到特定的DOM元素上。例如，如果你有一个id为"list"的div元素。
    //   const listElement = this.$refs.list; // 使用ref来引用元素。确保在模板中有一个<div ref="list" @scroll="handleScroll">包裹你的列表项</div>。
    //   listElement.addEventListener('scroll', this.handleScroll);
    // });
  },
  beforeDestroy() {
    // const listElement = this.$refs.list; // 移除监听器。确保你有这个引用。如果没有，你需要重新获取它。例如，通过document.getElementById或其他方式。
    // listElement && listElement.removeEventListener('scroll', this.handleScroll); // 使用条件运算符确保元素存在。
  }
};
</script>
<style scoped lang="scss">
.content{
  padding-bottom: 45px;
  .home-content{
    display: flex;
    height: 444px;
    margin: 10px 120px 85px;
    .classifybox{
      width: 20%;
      height: 100%;
      margin-right: 10px;
    }
    .bannerBox{
      flex: 1;
      min-width: 790px;
      height: 100%;
      margin: 0 10px;
    }
    .loginInfoBox{
      width: 20%;
      height: 100%;
    }
  }
  .miaoshabox{
    width: 100%;
    margin: 85px 0 60px;
  }
  .divider{
    margin: 60px 120px;
  }

}
</style>
